<template>
	<view class="bodys">
		<div class="header" ref="header">
			<div class="imgs">
				<u-avatar :src="avatarUrl"></u-avatar>
			</div>
			<div class="xinxi">
				<div class="name">
					{{nickName || "游客"}}
				</div>
				<div class="yewuyuan" style="text-align: center;">
					{{who || "无名氏"}}
				</div>
			</div>
		</div>
		<div class="jianjie">
			<div class="jj" >
					<navigator url="/pages/shop/customer">
						<div>客户</div>
						<div>
							<p>{{list.customer_sum }}</p>
						</div>
					</navigator>
			</div>
			<div class="jj" >
					<navigator url="/pages/shop/shopadmin">
						<div>店铺</div>
						<div>
							<p>{{list.agent_shop_sum }}</p>
						</div>
					</navigator>
			</div>
			<div class="jj" >
					<navigator url="/pages/shop/Withdrawal">
						<div>佣金</div>
						<div>
							<p><u-icon name="rmb" color="$red" size="24" label-pos="left">
							</u-icon> {{list.commission || ""}}</p>
						</div>
					</navigator>
			</div>
		</div>
		<div class="mar">
			
		</div>
		<view class="u-flex caozuo">
			<view class="box" v-for="item in agent_idlist" :key="item.id">
				<navigator :url="item.to">
					<div 
					:style="{backgroundImage:'url('+item.icons+')'}"
					>
						{{item.text}}
					</div>
				</navigator>
			</view>
		</view>
		
		<u-top-tips ref="uTips"></u-top-tips>
	</view>
</template>

<script>
	// import Mylist from "../../component/user/Mylist.vue"
	export default {
		components: {
			// Mylist,
		},
		data() {
			return {
				centerlist:[
					{
						text:"客户",
						value:"205",
						to:"/pages/shop/customer"
					},
					{
						text:"店铺",
						value:"205",
						to:"/pages/shop/customer"
					},
					{
						text:"佣金",
						value:"205",
						to:""
					}
					
				],
				agent_idlist:[
					{
						id:1,
						icons:this.$url+"/upload/icons/tianjiayouhu.png",
						text:"添加客户",
						to:"/pages/shop/add1"
					},
					{	
						id:2,
						icons:this.$url+"/upload/icons/dianpuguanli.png",
						text:"添加店铺",
						to:"/pages/shop/addshop"
					},
					{
						id:3,
						icons:this.$url+"/upload/icons/chongzhi.png",
						text:"客户充值记录",
						to:"/pages/shop/history"
					},
					{
						id:4,
						icons:this.$url+"/upload/icons/tixian.png",
						text:"客户提现记录",
						to:"/pages/shop/historytixian"
					},
					{
						id:5,
						icons:this.$url+"/upload/icons/tianjiayouhu.png",
						text:"店铺运营数据",
						to:"/pages/shop/index"
					},
					
				],
				list:{},
				nickName: "",
				avatarUrl: "",
				who:"",
				agent_id: "",
			}
		},
		onReady() {
			var that=this
			wx.showLoading({	
			  title: '加载中',
			  success(){
				  that.requests()
				  that.gets()
				  that.createds()
			  }
			})
		setTimeout(function () {
		  wx.hideLoading()
		}, 1000)
		},
		methods: {
			createds() {
				var that=this
				wx.getStorage({
					key:"agent_id",
					success() {
						that.who="业务员"
					},
					fail(){
						wx.getStorage({
							key:"customer_id",
							success() {
								
								return false
							},
							fail(){
								that.shenfen=3
								that.agent_idlist=[
							{
							id:1,
							icons:that.$url+"/upload/icons/tianjiayouhu.png",
							text:"简单介绍",
							// to:""
							},
							{
							id:2,
							icons:that.$url+"/upload/icons/tianjiayouhu.png",
							text:"案例展示",
							// to:""
							},
							{
							id:3,
							icons:that.$url+"/upload/icons/tianjiayouhu.png",
							text:"关于我们",
							// to:"/pages/shop/index"
							},
							{
							id:4,
							icons:that.$url+"/upload/icons/tianjiayouhu.png",
							text:"登录注册",
							to:"/pages/index/login"
							},
							{
							id:5,
							icons:that.$url+"/upload/icons/tianjiayouhu.png",
							text:"扫码授权绑定",
							to:"/pages/user/custwanshan"
							},
							]
								console.log("游客身份");
								console.log(that.agent_idlist);
							}
						})
						
					}
				})
			},
			gets() {
				let that = this
					wx.getStorage({
						key:"nickName",
						success(res) {
							that.nickName=res.data
						}
					})
					wx.getStorage({
						key:"avatarUrl",
						success(res) {
							that.avatarUrl=res.data
						}
					})
					
			},
			requests() {
				let that = this
				wx.getStorage({
					key:"agent_id",
					success(res) {
						console.log(res.data)
						that.$flyio.get('v1.agent/info', {
						       agent_id: res.data
						      }).then((ret) => {
								  console.log("业务员请求返回");
								  that.list=ret.data
						       console.log(ret)
						      })
						      .catch((e) => {
						       console.log(e)
						      })
					}
				})
			
			}
		},
	}
</script>

<style scoped lang="scss">
	// 来自mylist
	.box{
		border: 1px solid $gary;
		 width: calc(100% / 3);
		// flex: 1;
		background-color: $f;
		box-sizing: border-box;
	}
	.mains{
		width: 100%;
	}
	.caozuo {
		flex-wrap: wrap;
		div {
			height: 210upx;
			background-size: 60upx;
			background-repeat: no-repeat;
			background-position: 50% 50%;
			text-align: center;
			line-height: 325upx;
		}
	}
	.header {
		padding-left: 47upx;
		// margin-top: 10upx;
		background-color: #ff6666;
		height: 184upx;
		display: flex;
		width: 100%;
		flex-direction: row;
		align-items: center;
	
		image {
			border-radius: 50%;
			width: 122rpx;
			height: 122rpx;
		}
	
		.yewuyuan {
			width: 74upx;
			height: 28upx;
			background-color: #ff9900;
			color: #FFFFFF;
			font-size: 20upx;
		}
	
		.xinxi {
			margin-left: 25upx;
	
			.name {
				margin-bottom: 22upx;
				color: #FFFFFF;
				font-size: 30upx;
			}
	
			align-self: center;
		}
	}
	.bodys {
		background-color: $f;
		height: 100%;
		width: 100%;
	}
	p {
		color: #ff6666;
		font-size: 27upx;
	}
	image {
		border-radius: 50%;
		width: 122rpx;
		height: 122rpx;
	}
	.mar{
		height: 15upx;
		width: 100%;
		background-color: $gary;
	}
	.jianjie{
		height: 120rpx;
		width: 100%;
		background-color: red;
		.jj{
			height: 120rpx;
			background-color: $f;
			border: 1px solid $gary;
			box-sizing: border-box;
			float: left;
			width: calc(100% / 3);
			text-align: center;
			display: flex;
			flex-direction: column;
			justify-content: space-around;
		}
	}
</style>
